<!--
* @description:转正办理
* @fileName: PositiveToDealWith
* @author:孟帅龙
* @date:2021-1-14
* @后台人员:孟帅龙
-->
<template>
  <div>
    <!-- 转正办理 -->
    <div class="zzblselect">
      <el-form :inline="true" class="demo-form-inline">
        <el-form-item label="姓名：">
          <el-input v-model="PromotionName" placeholder="请输入姓名"></el-input>
        </el-form-item>
        <el-form-item label="部门：">
          <el-select v-model="DeptId" placeholder="请选择部门">
            <el-option
              v-for="item in dept"
              :key="item.value"
              :label="item.DeptName"
              :value="item.Id"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="职位：">
          <el-select v-model="PositionId" placeholder="请选择职位">
            <el-option
              v-for="item in job"
              :key="item.value"
              :label="item.PositionName"
              :value="item.Id"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="入职日期：">
          <el-date-picker
            type="date"
            placeholder="请选择入职日期"
            v-model="EntryTime"
            style="width: 100%"
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="申请日期：">
          <el-date-picker
            type="date"
            placeholder="请选择申请日期"
            v-model="ApplyTime"
            style="width: 100%"
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="审批状态：">
          <el-select v-model="State" placeholder="请选择部门">
            <el-option
              v-for="item in state"
              :key="item.value"
              :label="item.DictionaryName"
              :value="item.Id"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="loadData">查询</el-button>
          <el-button @click="loadReset">重置</el-button>
          <el-button type="success">新增</el-button>
          <el-button type="danger" @click="handleBatchDelete">批量删除</el-button>
        </el-form-item>
      </el-form>
    </div>
    <div class="zzbltable">
      <el-table
        ref="multipleTable"
        :data="tableData"
        tooltip-effect="dark"
        style="width: 100%"
        @selection-change="handleSelectionChange"
      >
        <el-table-column type="selection" width="55"> </el-table-column>
        <el-table-column prop="PromotionName" label="姓名"> </el-table-column>
        <el-table-column prop="BName" label="部门"> </el-table-column>
        <el-table-column prop="CName" label="职位"> </el-table-column>
        <el-table-column label="入职日期">
          <template slot-scope="scope">
            {{scope.row.EntryTime.substr(0,10)}}
          </template>
        </el-table-column>
        <el-table-column label="申请日期">
          <template slot-scope="scope">
            {{scope.row.ApplyTime.substr(0,10)}}
          </template>
        </el-table-column>
        <el-table-column prop="DName" label="审批状态"> </el-table-column>
        <el-table-column label="创建时间">
          <template slot-scope="scope">
            {{scope.row.CreateTime.substr(0,10)}}
          </template>
        </el-table-column>
        <el-table-column prop="Approver" label="审批人"> </el-table-column>
        <el-table-column label="操作" width="300">
          <template slot-scope="scope">
            <el-button size="mini" @click="handleEdit(scope.$index, scope.row)"
              >编辑</el-button
            >
            <el-button
              size="mini"
              type="danger"
              @click="handleDelete(scope.row)"
              >删除</el-button
            >
            <el-button size="mini" @click="handleEdit(scope.$index, scope.row)"
              >查看</el-button
            >
            <el-button
              size="mini"
              type="success"
              v-if="
                scope.row.State == 18 ||
                scope.row.State == 19
              "
              @click="handleCheck(scope.row)"
              >{{
                scope.row.State == 18 ? "重新提交" : "提交审批"
              }}</el-button
            >
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div class="zzblpage">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="pageindex"
        :page-sizes="[1, 3, 5, 10]"
        :page-size="pagesize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="totalcount"
      >
      </el-pagination>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      PromotionName: "",
      DeptId: 0,
      PositionId: 0,
      EntryTime: "",
      ApplyTime: "",
      State: 0,
      tableData: [],
      pageindex: 1,
      pagesize: 3,
      totalcount: 0,
      ids:[],
      dept:[],
      job:[],
      state:[],
    };
  },
  methods: {
    loadData() {
      this.$axios
        .get("https://localhost:44399/api/app/promotion/promotion-page-show", {
          params: {
            //?PromotionName=1&DeptId=1&PositionId=1&EntryTime=1&ApplyTime=1&State=1&pageindex=1&pagesize=3
            PromotionName: this.PromotionName,
            DeptId:this.DeptId,
            PositionId:this.PositionId,
            EntryTime: this.EntryTime,
            ApplyTime:this.ApplyTime,
            State: this.State,
            pageindex: this.pageindex,
            pagesize: this.pagesize,
          },
        })
        .then((res) => {
          this.tableData = res.data.PageData;
          this.totalcount = res.data.PageTotal;
        });
    },
    handleSizeChange(val) {
      this.pagesize = val;
      this.loadData();
    },
    handleCurrentChange(val) {
      this.pageindex = val;
      this.loadData();
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
      this.ids = [];
      for (var i = 0; i < val.length; i++) {
        this.ids.push(val[i].Id);
      }
    },
    //重置
    loadReset() {
      this.PositionName = "";
      this.DeptId = 0;
      this.PositionId = 0;
      this.State = 0;
      this.EntryTime = "";
      this.ApplyTime="";
      this.loadData();
    },
    loadDept() {
      this.$axios
        .get("https://localhost:44399/api/app/department/dept")
        .then((res) => {
          this.dept = res.data.PageData;
          this.dept.unshift({ Id: 0, DeptName: "请选择" });
        });
    },
    loadJob() {
      this.$axios
        .get("https://localhost:44399/api/app/position/position")
        .then((res) => {
          this.job = res.data.PageData;
          this.job.unshift({ Id: 0, PositionName: "请选择" });
        });
    },
    loadDictionary() {
      this.$axios
        .get("https://localhost:44399/api/app/oil-cost/bind")
        .then((res) => {
          let d = res.data.PageData;
          this.state = d.filter((u) => {
            return u.DictionaryType == "ApprovalStatusk";
          });
          this.state.unshift({ Id: 0, DictionaryName: "请选择" });
        });
    },
    //删除
    handleDelete(row) {
      this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
        center: true,
      })
        .then(() => {
          this.$axios
            .delete('https://localhost:44399/api/app/promotion/'+row.Id+'/promotion')
            .then((res) => {
              if (res.data > 0) {
                this.$message.success("删除成功");
                this.loadData();
              } else {
                this.$message.error("删除失败");
              }
            });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },
    //批量删除
    handleBatchDelete() {
      if (this.ids.length == 0) {
        this.$message.warning("请至少选择一条操作的数据");
        return;
      }
      this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
        center: true,
      })
        .then(() => {
          this.$axios
            .delete(
              "https://localhost:44399/api/app/promotion/batch-promotion?ids=" +
                this.ids.toString()
            )
            .then((res) => {
              if (res.data > 0) {
                this.$message.success("批量删除成功");
                this.loadData();
              } else {
                this.$message.error("批量删除失败");
              }
            });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消批量删除",
          });
        });
    },
  },
  created() {
    this.loadData();
    this.loadDept();
    this.loadJob();
    this.loadDictionary();
  },
};
</script>

<style>
.zzblselect {
  margin: 10px;
}
.zzbltable {
  margin: 10px;
}
.zzblpage {
  margin: 10px;
}
</style>